@extends('layout.index')
@section('title','用户列表')
@section('content')
    <div class="row">
        <div class="col-lg-12">
            <h1 class="page-header">用户列表</h1>
        </div>
        <!-- /.col-lg-12 -->
    </div>
	<div class="col-lg-12">
    <div class="panel panel-default">
        <!-- /.panel-heading -->
        <div class="panel-body">
            <div class="dataTable_wrapper">
                <div id="dataTables-example_wrapper" class="dataTables_wrapper form-inline dt-bootstrap no-footer">
                <form action="/admin/uadd/index" method="get">
                <div class="row"><div class="col-sm-6"><div class="dataTables_length" id="dataTables-example_length"><label>显示 <select name="num" aria-controls="dataTables-example" class="form-control input-sm">
                <option value="10" 
                @if(!empty($request['num']) && $request['num'] == 10)
                    selected
                @endif
                >10</option>
                <option value="25" 
                @if(!empty($request['num']) && $request['num'] == 25)
                    selected
                @endif
                >25</option>
                <option value="50" 
                @if(!empty($request['num']) && $request['num'] == 50)
                    selected
                @endif
                >50</option>
                <option value="100" 
                @if(!empty($request['num']) && $request['num'] == 100)
                    selected
                @endif
                >100</option></select> 条</label></div></div><div class="col-sm-6"><div id="dataTables-example_filter" class="dataTables_filter"><label>搜索:<input 
                @if(!empty($request['keywords']))
                    value="{{$request['keywords']}}"
                @endif
                type="search" name="keywords" class="form-control input-sm" placeholder="" aria-controls="dataTables-example"><button class="btn btn-info">搜索</button></label></div></div></div>
                </form>
                <div class="row">
                <div class="col-sm-12">
                <table id="dataTables-example" class="table table-striped table-bordered table-hover dataTable no-footer" role="grid" aria-describedby="dataTables-example_info">

                    <thead>
                        <tr role="row"><th class="sorting_asc" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" style="width: 191px;" aria-sort="ascending" aria-label="Rendering engine: activate to sort column descending">id</th><th class="sorting" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" style="width: 219px;" aria-label="Browser: activate to sort column ascending">用户名</th><th class="sorting" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" style="width: 200px;" aria-label="Platform(s): activate to sort column ascending">邮箱</th><th class="sorting" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" style="width: 164px;" aria-label="Engine version: activate to sort column ascending">手机</th><th class="sorting" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" style="width: 164px;" aria-label="Engine version: activate to sort column ascending">状态</th><th class="sorting" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" style="width: 119px;" aria-label="CSS grade: activate to sort column ascending">头像</th><th class="sorting" tabindex="0" aria-controls="dataTables-example" rowspan="1" colspan="1" style="width: 119px;" aria-label="CSS grade: activate to sort column ascending">操作</th></tr>
                    </thead>
                    <tbody>
                    @foreach($users as $k => $v)
                    <tr class="gradeA odd" role="row">
                            <td class="sorting_1 sid">{{$v->id}}</td>
                            <td>{{$v->username}}</td>
                            <td>{{$v->email}}</td>
                            <td class="center">{{$v->phone}}</td>
                            <td class="center">{{str_replace([1,2],['未激活','激活'],$v->status)}}</td>
                            <td class="center"><img width="50px" src="{{$v->pic}}" alt=""></td>
                            <td class="center">
                            <button class="btn btn-warning btn-circle btn_delete" type="button"><i class="fa fa-times"></i></button>
                            <a href="/admin/uadd/edit?id={{$v->id}}" class="btn btn-success btn-circle"><i class="fa fa-link"></i></a>
                            </td>
                    </tr>
                    @endforeach
                    </tbody>
                </table></div></div><div class="row"><div class="col-sm-8"><div class="dataTables_paginate paging_simple_numbers" id="dataTables-example_paginate"><ul class="pagination">
                    {!! $users->appends($request)->render() !!}
                </ul></div></div></div></div>
            </div>
        </div>
    </div>
    </div>

@endsection
@section('myjs')
    <script type="text/javascript">
        //绑定删除事件
        $('.btn_delete').click(function(){

            //获取id
            var id = $(this).parents('tr').find('.sid').html();
            var btn = $(this);
        /**
        *ajax请求会出现token验证 csrf保护问题 500 解决办法
            1.在头部header中添加以下标签 
            <meta name="csrf-token" content="{{ csrf_token() }}">
            2.设置全局配置 post get是否异步 也是用这个方法修改$.ajaxSetup
            $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
        */    
        $.ajaxSetup({
            headers: {
                'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });
            //发送ajax
            $.post('{{url("/admin/uadd/ajaxdelete")}}',{id:id},function(data){
                if(data == 1){
                    btn.parents('tr').remove();
                }
            });

        })
    </script> 
@endsection